<template>
	<za-page-content :header="$route.meta.title" :scroll="false">
		<za-table ref="table" :data="dataList" highlight-current-row :total="total" @action-change="actionChange" :is-loading="listLoading" :hidePage="hidePage">
			<el-col :span="24"  style="padding-bottom: 0px;" slot="searchBar">
				<za-form :config="searchConfig" @submit="filter">
				</za-form>
			</el-col>
			<el-table-column type="index" width="55"></el-table-column>
			<el-table-column prop="name" label="姓名" min-width="100"></el-table-column>
			<el-table-column prop="age" label="年龄" min-width="100"></el-table-column>
			<el-table-column prop="phone" label="手机" min-width="100"></el-table-column>
			<el-table-column prop="birthday" label="生日" min-width="100">
				<template slot-scope="{row, column, $index}">
					<span>{{row.birthday|date(true)}}</span>
				</template>
			</el-table-column>
			<el-table-column prop="description" label="描述" min-width="100"></el-table-column>
			<el-table-column label="操作" width="300">
				<template slot-scope="{row, column, $index}">
					<el-col>
						<el-button type="text">编辑</el-button>
					</el-col>
				</template>
			</el-table-column>
		</za-table>
	</za-page-content>
</template>

<script>

	import {get, post, toast, alert, confirm, notify} from '../../api/common.js'
	import moment from 'moment';
	import * as url from '../../api/url'
	import * as constant from '../../constant'
	import eventHub from '../../util/eventHub';
	import {mapState} from 'vuex'
	import {searchConfig} from './page-data'

	export default {
		name: "tableList",
		components:{
		},
		data() {
			return {
				listLoading: false,
				dataList: [],
				total: 0,

				hidePage: false,

				searchConfig: searchConfig,

				pageConfig: {
					pageNo: 1,
					pageSize: 10,
				},
				filterParams:{

				},
			}
		},
		computed: {

		},
		methods: {
			// create(){
			// 	this.$refs.editDialog.show("add", {tagList:[]})
			// },
			// edit(row){
			// 	this.$refs.editDialog.show('edit', row)
			// },
			// remove(row){
			// 	confirm(`确定要删除 ${row.sympName} 吗？`, ()=>{
			// 		post(url.SYMPTOM_DELETE, {
			// 			id: row.id,
			// 		}).then(res=>{
			// 			this.queryList();
			// 		})
			// 	})
			// },
			// afterEdit(value){
			// 	this.queryList();
			// },
			filter(filters) {
				this.filterParams = filters;
				if(this.pageConfig.pageNo===1){
					this.queryList();
					return;
				}
				this.$refs.table.resetPagination(1);
			},
			actionChange(params) {
				this.pageConfig =  {
					pageNo: params.pageNo || this.pageConfig.pageNo,
					pageSize: params.pageSize || this.pageConfig.pageSize,
				}

				this.queryList();
			},
			queryList(){
				this.listLoading = true;
				let param = this.hidePage?this.filterParams:{
					...this.pageConfig,
					...this.filterParams,
				}
				post(url.TABLE_LIST,param,(res)=>{
					this.dataList = this.hidePage?res:res.rows;
					this.total = this.hidePage?res.length:res.total;
				},null, ()=>{
					this.listLoading = false
				})
			}
		},
		mounted() {

		},
		created() {
			this.queryList();
		},
	}
</script>

<style scoped>
	.mb-10{
		margin-bottom: 10px;
	}
	.col-detail{
		text-align: left;
		display: -webkit-box;
		overflow: hidden;
		white-space: normal !important;
		word-wrap: break-word;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
	}
</style>
